﻿@inherits AppAuthComponentBase
@implements IDisposable
@inject NavigationManager NavigationManager

<header class="border-b border-gray-200 dark:border-gray-800 pr-3">
    <div class="flex flex-wrap items-center">
        <div class="flex flex-grow flex-shrink flex-nowrap justify-end items-center">
            <nav class="relative flex flex-grow">
                <ul class="flex flex-wrap items-center justify-end w-full m-0">

                    <li class="relative flex flex-wrap just-fu-start m-0">
                        <NavLink href="about" class="p-4 flex items-center justify-start mw-full hover:text-sky-500 dark:hover:text-sky-400" ActiveClass="text-blue-700 dark:text-blue-300">About</NavLink>
                    </li>
                    <li class="relative flex flex-wrap just-fu-start m-0">
                        <NavLink href="deploy" class="p-4 flex items-center justify-start mw-full hover:text-sky-500 dark:hover:text-sky-400" ActiveClass="text-blue-700 dark:text-blue-300">Deploying</NavLink>
                    </li>
                    <li class="relative flex flex-wrap just-fu-start m-0">
                        <NavLink href="privacy" class="p-4 flex items-center justify-start mw-full hover:text-sky-500 dark:hover:text-sky-400" ActiveClass="text-blue-700 dark:text-blue-300">Privacy</NavLink>
                    </li>

                    <AuthorizeView Roles="Admin">
                        <Authorized>
                            <li class="relative flex flex-wrap just-fu-start m-0">
                                <NavLink href="admin" class="p-4 flex items-center justify-start mw-full hover:text-sky-500 dark:hover:text-sky-400" ActiveClass="text-blue-700 dark:text-blue-300">Admin</NavLink>
                            </li>
                        </Authorized>
                    </AuthorizeView>
                    <AuthorizeView>
                        <Authorized>
                            <li>
                                <div class="mx-3 relative">
                                    <div>
                                        <a href="Account/Manage"
                                            class="max-w-xs bg-white dark:bg-black rounded-full flex items-center text-sm focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-cyan-500 lg:p-2 lg:rounded-md lg:hover:bg-gray-50 dark:lg:hover:bg-gray-900 dark:ring-offset-black" id="user-menu-button" aria-expanded="false" aria-haspopup="true">
                                            <img class="h-8 w-8 rounded-full" src=@User.GetProfileUrl() alt="">
                                            <span class="hidden ml-3 text-gray-700 dark:text-gray-300 text-sm font-medium lg:block">
                                                <span class="sr-only">Open user menu for </span>
                                                @User.GetDisplayName()
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </li>
                            <li class="mr-3 relative flex flex-wrap just-fu-start m-0">
                                <form action="Account/Logout" method="post">
                                    <AntiforgeryToken />
                                    <input type="hidden" name="ReturnUrl" value="@currentUrl" />
                                    <SecondaryButton type="submit">
                                        Sign Out
                                    </SecondaryButton>
                                </form>
                            </li>
                        </Authorized>
                        <Authorizing>
                            <li class="relative flex flex-wrap just-fu-start m-0">
                                <NavLink href="Account/Login" class="m-2 mr-4">
                                    <SecondaryButton>
                                        Sign In
                                    </SecondaryButton>
                                </NavLink>
                            </li>
                        </Authorizing>
                        <NotAuthorized>
                            <li class="relative flex flex-wrap just-fu-start m-0">
                                <NavLink href="Account/Login" class="m-2 mr-4">
                                    <SecondaryButton>
                                        Sign In
                                    </SecondaryButton>
                                </NavLink>
                            </li>
                        </NotAuthorized>
                    </AuthorizeView>

                    <li class="relative flex flex-wrap just-fu-start m-0">
                        <DarkModeToggleLite />
                    </li>

                </ul>
            </nav>
        </div>
    </div>
</header>

@code {
    private string? currentUrl;

    protected override void OnInitialized()
    {
        currentUrl = NavigationManager.ToBaseRelativePath(NavigationManager.Uri);
        NavigationManager.LocationChanged += OnLocationChanged;
    }

    private void OnLocationChanged(object? sender, LocationChangedEventArgs e)
    {
        currentUrl = NavigationManager.ToBaseRelativePath(e.Location);
        StateHasChanged();
    }

    public void Dispose()
    {
        NavigationManager.LocationChanged -= OnLocationChanged;
    }
}

